<template>
	<view>
		<u-popup :show="pupshow" @close="headerClose" :safeAreaInsetBottom="false" :round="20" mode="center" :customStyle="popupStyle">
			<view class="center-pop">
				<view class="title">{{popTitle}}</view>
				<view class="content">
					<scroll-view style="height: 100%;" scroll-y="true" enable-back-to-top="true" show-scrollbar="true">
						<u-empty v-if="!isSlot" textSize="24" iconColor="#fd7400" width="140px" height="140px" mode="data"
							:icon="contentdata.icon" marginTop="50%" :text="contentdata.text">
						</u-empty>
						<template v-else>
							<slot name="content"></slot>
						</template>
					</scroll-view>
				</view>
				<view class="btn">
					<u-button type="primary" color="#fd7400" shape="square" :customStyle="orangeBtn" @click="saveclick(true)">同意</u-button>
					<!-- <u-button type="primary" color="#fd7400" shape="square" :customStyle="orangeBtn" @click="term_show=false"></u-button> -->
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	export default {
		name:"centerpop",
		props: {
			popTitle: {				// 标题
				type: String,
				default: ' ',
			},
			tipData: {
				type: String,
				default: '',
			},
			isSlot: {
				type: Boolean,
				default: false,
			},
			height: {
				type: String,
				default: '',
			},
			isCancel: {				// 是否显示取消按钮
				type: Boolean,
				default: false,
			},
			cancelText: {
				type: String,
				default: '取消',
			}
		},
		watch: {
			pupshow: {
				handler(newVal) {
					if(newVal && this.tipData.length > 0) {
						const res = JSON.parse(this.tipData);
						Object.keys(this.contentdata).forEach(val => {
							this.contentdata[val] = res[val]
						})
					}
				},
				deep: true,
			}
		},
		data() {
			return {
				pupshow: false,  		// 弹窗显示
				contentdata: {
					iocn: 'http://cdn.uviewui.com/uview/empty/data.png',
					text: '此功能正在开发',
				},
				orangeBtn: {
					height: '50px !important',
					background: 'linear-gradient(90deg, rgba(253, 116, 0, 1) 0%, rgba(255, 87, 51, 1) 100%)',
					border: '0',
					boxShadow: '0px 7px 40px  rgba(253, 112, 8, 0.2)',
					borderRadius: '8px',
					fontSize: '18px'
				},
			}
		},
		methods: {
			// 确认
			saveclick(bool) {
				this.headerClose();
				if(bool) {
					this.$emit('saveclick')
				}
			},
			// 关闭弹窗
			headerClose() {
				this.pupshow = false;
			},
		}
	}
</script>

<style lang="scss">
	.center-pop { 
		overflow: hidden;
		width: 90vw;
		height: 70vh;
		padding: 20rpx;
		
		.title {
			height: 8vh;
			line-height: 8vh;
			text-align: center;
			font-size: 40rpx;
			font-weight: 700;
		}
		
		.content {
			height: 50vh;
			padding: 0rpx 20rpx 20rpx;
		}
		
		.btn {
			height: 10vh;
			padding-top: 30rpx;
		}
	}
	
</style>